<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="{% static 'plugins/layui/css/layui.css' %}">
</head>
<body>
<form class="layui-form" style="padding: 20px">
    <div class="layui-form-item">
        <input type="text" class="layui-input" name="name" lay-verify="required" placeholder="请输入新类目">
    </div>
    <div class="layui-form-item">
        <button class="layui-btn layui-btn-fluid" lay-filter="addType" lay-submit>提交</button>
    </div>
</form>

</body>
<script src="{% static 'plugins/layui/layui.all.js' %}"></script>
<script src="{% static 'js/cms/common.min.js' %}"></script>
<script>
    form.on("submit(addType)", function (data) {
        //弹出loading
        var index = top.layer.msg('数据提交中，请稍候', {icon: 16, time: false, shade: 0.8});
        // 实际使用时的提交信息
        $.ajax({
            url: api+'types/',
            method: 'post',
            data: data.field,
            success: function (res) {
                if (!res.code) {
                    top.layer.close(index);
                    top.layer.msg("新增类目成功~~");
                    top.layer.closeAll("iframe");
                    top.location.reload()
                } else if (res.code == 1003) {
                    top.layer.msg(res.msg, {icon: 5});
                }else {
                    // 添加类目报错，只有name字段
                    top.layer.msg(res.msg, {icon: 5});
                }
            }
        })
        return false;
    })
</script>
</html>